<template>
  <div class="q-pa-md">
    <div class="q-gutter-sm">
      <t-btn color="primary">
        Hover
        <t-tooltip class="bg-indigo" :offset="[10, 10]"> Here I am! </t-tooltip>
      </t-btn>

      <t-btn color="primary">
        Over
        <t-tooltip class="bg-red" :offset="[10, 10]"> Here I am! </t-tooltip>
      </t-btn>

      <t-btn color="primary">
        These
        <t-tooltip class="bg-purple text-body2" :offset="[10, 10]">
          Here I am!
        </t-tooltip>
      </t-btn>

      <t-btn color="primary">
        Buttons
        <t-tooltip class="bg-amber text-black shadow-4" :offset="[10, 10]">
          Here I am!
        </t-tooltip>
      </t-btn>
    </div>
  </div>
</template>
